<template>
  <div class="view_page home">
    <el-card class="box-card">
      <!--卡片头部-->
      <div slot="header" class="clearfix">
        <!--左侧-->
        <div class="left">
          <div class="menu-title">
            列表
          </div>
        </div>
        <!--右侧-->
        <div class="right">
          <el-button type="primary">保存</el-button>
          <el-button>取消</el-button>
        </div>
      </div>
      <!--卡片内容-->
      <!--筛选-->
      <div class="query-operate">
        <el-form :inline="true" :model="TESTFROMDATA" class="demo-form-inline">
          <el-form-item label="输入框">
            <el-input v-model="TESTFROMDATA.user"
                      placeholder="输入框"></el-input>
          </el-form-item>
          <el-form-item label="筛选框">
            <el-select v-model="TESTFROMDATA.region" placeholder="筛选框">
              <el-option label="条件一" value="条件一"></el-option>
              <el-option label="条件二" value="条件二"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <!--列表-->
      <load-list :tableConfig="tableConfig"
                 :dataList="datalist"
                 :operationBar="operationBar"
                 @getListInfo="getListInfo">
      </load-list>
      <!--分页-->
      <pagination :total="total"
                  :currentPage="page"
                  :pageSize="pageSize"
                  position="right"
                  @search="searchPagination">
      </pagination>
    </el-card>
  </div>
</template>

<script>
import { Message } from 'element-ui'
import LoadList from '@/components/common/loadList/loadList'
import Drawer from '@/components/common/Drawer/Drawer'
import pagination from '@/components/common/pagination/pagination'

export default {
  components: {
    LoadList,
    Drawer,
    pagination,
  },
  data() {
    return {
      // 筛选内容
      TESTFROMDATA: {
        user: '',
        region: '',
      },
      // 列表的 key 值
      tableConfig: [{
        prop: 'name',
        label: '名称',
        width: '',
      }, {
        prop: 'registerTime',
        label: '注册时间',
        width: '',
      }, {
        prop: 'adminNumber',
        label: '管理员账号',
        width: '',
      }],
      // 列表的数据
      datalist: [{
        id: 1,
        name: '山东大学齐鲁软件学院',
        registerTime: '2019-02-14 15:09:18',
        adminNumber: 'shandongdaxueadmin',
      }, {
        id: 2,
        name: '北京航空航天大学',
        registerTime: '2019-02-14 15:10:12',
        adminNumber: 'beijinghangkonghangtiandaxue',
      }, {
        id: 3,
        name: '西北科技大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'xibeikejidaxue',
      }, {
        id: 4,
        name: '湖南大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'hunandaxue',
      }, {
        id: 5,
        name: '电子科技大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'dianjikejidaxue',
      }, {
        id: 6,
        name: '中国人民大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'zhongguorenmindaxue',
      }, {
        id: 7,
        name: '哈尔滨军事工程学院',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'haerbinjunshigongchengxueyuan',
      }, {
        id: 8,
        name: '国防科技大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'guofangkejidaxue',
      }, {
        id: 9,
        name: '西北工业大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'xibeigongyedaxue',
      }, {
        id: 10,
        name: '上海交通大学',
        registerTime: '2019-02-15 11:22:22',
        adminNumber: 'shanghaijiaotongdaxue',
      }],
      // 操作菜单
      operationBar: {
        list: [{
          label: '删除',
          type: 'delete',
        }, {
          label: '详情',
          type: 'details',
        }],
      },
      total: 0,
      page: 1,
      pageSize: 2,
    }
  },
  mounted() {
  },
  created() {
    if (this.$route.query.flag == 'detail') {
      this.page = Number.parseInt(sessionStorage.getItem('pageNum'))
    }
    this.getList()
  },
  methods: {
    getList() {

      setTimeout(() => {
        // 列表遮挡层关闭
        this.$store.state.Site.listLoading = false
      }, 1000)

    },
    getListInfo(obj) {
      Message.info(`点击了的类型 ${obj.type} ,id 是 ${obj.row.id}`)
      this.$router.push({
        path: '/test-page',
        query: {
          name: obj.row.name,
        },
      })
    },
    searchPagination(page) {
      this.page = page
      sessionStorage.setItem('pageNum', page)
      this.getList()
    },
    go() {
      this.$router.push({path: '/test-details'})
    },
  },
}
</script>

<style>

</style>
